<template>
    <h3>发布导航</h3>
    <div class="navi_add_form">
        <div class="opt">
            <el-input v-model="navi_name" style="width: 360px; height: 44px; font-size: 16px" placeholder="轮播图标题" />
        </div>
        <div class="opt">
            <el-button @click="addNaviFn" type="primary" size="large">上传导航</el-button>
        </div>
    </div>
</template>

<script setup lang="ts">
    import { ref } from 'vue'
    import { addNavFunc } from '../../api/request'
    import { ElMessage, ElMessageBox } from 'element-plus';
    let navi_name = ref('')
    // article_id,article_title,article_author,article_content,article_type,article_address,article_tags,article_hot,nav_name,user_id
    // 发布轮播图
    const addNaviFn = async () => {
        //发布轮播
        await addNavFunc({
            nav_name:navi_name.value
        })
        .then(
            (content: any) => {
                // console.log(content);
                if (content.data.code == 200) {
                    ElMessage.success(content.data.msg)
                    // 隐藏弹窗(重置表单信息)
                    navi_name.value = '';
                    // 重新获取轮播图数据列表
                }
                else {
                    ElMessage.error(content.data.msg)
                }
            }
        )
        .catch(
            err => {
                ElMessage.error(err.msg)
            }
        )
    } 
</script>

<style lang="scss">
    .navi_add_form {
      .opt {
           margin-top: 15px;
        }
    }
</style>